<template>
    <div class="login">
        <form>
            <div>
                <label for="username">用户名：</label>
                <input type="text" id="username" v-model="loginForm.username" />
            </div>

            <div>
                <label for="password">密码：</label>
                <input
                    type="password"
                    id="password"
                    v-model="loginForm.password"
                />
            </div>

            <div>
                <button @click.prevent="login">登录</button>
            </div>
        </form>
    </div>
</template>

<script>
export default {
    data() {
        return {
            loginForm: {
                username: '',
                password: '',
            },
        };
    },
    methods: {
        async login() {
            console.log('this.loginForm', this.loginForm);
            const res = await this.$http.post('/denglu', this.loginForm);
            console.log('res', res);
            // 保存登录数据
            // sessionStorage 只能存字符串，如果是对象，我们就给它转成JSON字符串
            window.sessionStorage.setItem(
                'user',
                JSON.stringify(res.data.user),
            );
            window.sessionStorage.setItem('token', res.data.token);
            // 跳转到签到页面
            this.$router.push('/mine');
        },
    },
};
</script>

<style lang="scss" scoped></style>
